.. include:: data/standard.txt
.. include:: data/header_footer.txt
.. include:: data/table_colspan.txt
.. include:: data/table_rowspan.txt
.. include:: data/table_complex.txt
.. include:: data/list_table.txt
.. include:: data/custom_roles.txt
.. include:: data/svg_images.txt
.. include:: data/swf_images.txt

Changes to the html4css1 writer
===============================

* Use only meta keywords recognized by HTML 5.

* Style table column widths with CSS rule, not "width" argument.

* Vertical alignment of table heads with CSS.

* Field lists as styled definition lists.

* Do not drop paragraph objects, use CSS rules to prevent unwanted vertical
  space.

* Put subtitles in <p> elements.

Description list
----------------

Definition lists with the ``description`` class argument:

.. class:: description

description lists
  Lists that are styled like in most dictionaries, encyclopedias
  etc. (as well as the LaTeX `description` environment).
label
  The term to be described. Put in boldface.
content
  starts on the same line and has a hanging indent.


Field list handling
-------------------

The following list demonstrates the problems with the html4css1
approach: the `field-name-limit` setting is given in "number of
characters" but the field name uses a proportional font.

:The field name:  is typeset on the same line, unless it is "long".

:this field name: is considered "long" in the html table rendering by
                  the html4css1 writer with the default setting of
                  ``--field-name-limit=14``.

:iiiiiiiiiiiiiii: a field name that is considered "long" by html4css1
                  with the default setting of `field-name-limit: 14`.

:MMMMMMMMMMMMMM: a field name that is actually longer than the
                 previous one but regarded "short" by html4css1.

With `html4css2`, a `field list` is typeset as CSS-styled `definition
list`. The default layout is similar to the look with `html4css1`:

.. class:: open

:A long field name: sticks into the field body.

                The field body is pushed to the next line (you can suppress
                this behaviour with the `run-in`_ class argument).

:Customization: of the field name width is possible with CSS instead
                of the `field-name-limit` configuration setting, for
                example::

                    dl.field-list > dd { margin-left: 6em; }

Styling with class arguments
````````````````````````````

The ``xhtml11.css`` style sheet supports the following class arguments
for alternative styles:

*compact*
  .. class:: compact

  :Feature: No additional space between list items.

  :Option: The ``--compact-field-lists`` command line option (and the
           corresponding configuration setting) set the `compact`
           class argument on all "simple" field lists, if not
           overridden with `open`.

  :Use:  For lists with short field body.

*open*
  .. class:: open

  :Feature: Additional space between list items also in "simple" lists.
            (Overrides the ``--compact-field-lists`` command line
            option and the corresponding configuration setting)

  :Use: For "simple" lists that should keep the space between list items.

*narrow*
  .. class:: narrow

  :Feature: Less indented field body.
  :Use:   For lists with short field names.
  :A long field name:
       sticks into the field body and the field body starts on a
       new line (if not combined with `run-in`_).

.. _`run-in`:

*run-in*
  .. class:: run-in

  :Feature: Field body starts on the same line also after long field
            names.

  :A long field name: sticks into the field body which continues on
                         the same line.

  :The next field name:  and field body should align. Long text in the field
                         body is wrapped and aligns with other fields.


Table styling with class arguments
----------------------------------

The ``html-base.css`` style sheet provides rules for easy styling of tables
with the "class" directive or directive argument.

Numbered tables can be achieved with the ``numbered`` class option

.. table:: truth values
   :class: numbered

   ======= ======= ==========
   A       B       A or B
   ======= ======= ==========
   False   False   False
   True    False   True
   False   True    True
   True    True    True
   ======= ======= ==========

Currently, referencing to the table by number is not supported. This is a
common request and already on the `TODO list`.

In addition to the "borderless" table-style_, the style sheet also
defines "booktabs", that will be rendered similar to the style from
the booktabs_ LaTeX package.

.. _table-style:
   http://docutils.sourceforge.net/docs/user/config.html#table-style
.. _booktabs:
   http://tug.ctan.org/tex-archive/macros/latex/contrib/booktabs/booktabs.pdf

.. class:: booktabs

=====  =====  ======
False  False  False
True   False  True
False  True   True
True   True   True
=====  =====  ======

This table also uses the "align-left" class argument, to left-align
the headers:

.. class:: booktabs align-left

=====  =====  =======
  A      B    A or B
=====  =====  =======
False  False  False
True   False  True
False  True   True
True   True   True
=====  =====  =======


Of course, also "booktabs" style tables can be numbered:

.. table:: I/O values
   :class: numbered booktabs

   =====  =====  ======
      Inputs     Output
   ------------  ------
     A      B    A or B
   =====  =====  ======
   False  False  False
   True   False  True
   False  True   True
   True   True   True
   =====  =====  ======


Maths
-----

For maximal compatibility, the ``html-output`` setting defaults to »HTML«.
(HTML 5 accepts also MathML and SVG as nested languages.)

The linear mapping :math:`f: \mathbb{C}^{N}\longmapsto\mathbb{C}^{N}`
with

.. math::

  c_{k}=F(kf_{0})=T_{\text{A}}
  \sum_{n=-N/2}^{+N/2}f(x_{n})\text{e}^{-2\pi\text{i}\frac{nk}{N}}

for all :math:`a\in\mathbb{C}^{N}` is called discrete Fourier
transformation (DFT).


.. include:: data/errors.txt

.. footer:: |HTML 5| |validator| |valid-CSS2|

.. |HTML 5| image:: http://www.w3.org/html/logo/badge/html5-badge-h-css3-semantics.png
   :height: 31
   :width: 88
   :alt: Conforms to HTML 5
   :target: http://www.w3.org/TR/html5/

.. |validator| image:: https://validator-suite.w3.org/icons/vs-blue-256.png
   :height: 31
   :width: 88
   :alt: Check validity!
   :target: http://validator.w3.org/check?uri=referer

.. |valid-CSS2| image:: http://jigsaw.w3.org/css-validator/images/vcss
   :height: 31
   :width: 88
   :alt: Valid CSS 2.1!
   :target: http://jigsaw.w3.org/css-validator/check/referer
